import React, { PureComponent } from "react";
import { connect } from "dva";
import { Modal, Row, Col, Form, Input,  Icon, Button, message} from "antd";

const FormItem = Form.Item;
const { TextArea } = Input;


@connect(state => ({
  loading:state.equipment_maintain.loading,
  detaildata:state.equipment_maintain.detaildata,
  // selectSource:state.equipment_integrated.selectSourceForAdd,
}))
@Form.create()
export default class Add extends PureComponent {
  constructor(props) {
    super(props);
  }

  componentDidMount() {
    // 获取所有下拉数据的datasource
    // this.props.dispatch({
    //   type: "equipment_integrated/fetch_selectsource_for_add",
    // })
  }


  componentWillReceiveProps(nextProps) {
    if (nextProps.visible === true && this.props.visible === false) {
      // this.props.dispatch({
      //   type: "system_cooperation/fetch_all_collaborate"
      // });

      // 编辑时 读取详情
      if (nextProps.detailId && nextProps.detailId !== 0) {
          this.props.dispatch({
            type: "equipment_maintain/fetch_maintain_info",
            payload: {
              maintenanceId: nextProps.detailId
            }
          })
      }
    }
  }

  handleSubmit(e) {
    e.preventDefault();
    this.props.form.validateFieldsAndScroll((err, values) => {
      if (!err) {
        const { dispatch, detailId } = this.props;
        console.log(detailId);
        const maintenanceId = detailId === 0 ? undefined : detailId;
        const action = detailId === 0 ? 'add' : 'edit';
        dispatch({
            type: `equipment_maintain/${action}_maintain`,
            payload: {
              ...values,
              maintenanceId,
            }
          })
          .then(() => {
            this.handleReset();
            this.handleCancel();
            this.props.callback();
          });
      }
    });
  }

  handleReset = () => {
    this.props.form.resetFields();
  };

  handleCancel = () => {
    this.handleReset();
    this.props.onCancel(false);
  };


  initArrObject = (arr, name) => {
    if (arr) {
      let str = [];
      for (let i of arr) {
        str.push(i[name]);
      }
      return str.join("、");
    }
  };



  render() {
    const { visible, loading, detailId, detaildata, dictionaries } = this.props;
    const { getFieldDecorator } = this.props.form;

    const formItemLayout = {
      labelCol: { span: 8 },
      wrapperCol: { span: 16 }
    };

    const formItemLayoutOne = {
      labelCol: { span: 4 },
      wrapperCol: { span: 20 }
    };




    return (
      <div>
        <Modal
          title={detailId === 0 ? "新增维保单位" : "编辑维保单位"}
          okText={detailId === 0 ? "提交" : "编辑"}
          visible={visible}
          onOk={this.handleSubmit.bind(this)}
          confirmLoading={loading.model_submit}
          onCancel={this.handleCancel}
          width={600}
        >
          <Form layout="horizontal">
            <Row gutter={24}>
              <Col span={12}>
                <FormItem {...formItemLayout} label="单位名称" colon={false}>
                  {getFieldDecorator("maintenanceName", {
                    initialValue: detailId === 0 ? null : detaildata.maintenanceName,
                    rules: [
                      { required: true, message: "请输入维保单位名称" },
                    ]
                  })(
                    <Input placeholder="请输入单位名称" />
                  )}
                </FormItem>
              </Col>
              <Col span={12}>
                <FormItem {...formItemLayout} label="地址" colon={false}>
                  {getFieldDecorator("mainAddress", {
                    initialValue: detailId === 0 ? null : detaildata.mainAddress,
                    rules: [
                      // { required: true, message: "请输入设备名称" },
                    ]
                  })(
                    <Input placeholder="请输入地址" />
                  )}
                </FormItem>
              </Col>
              <Col span={12}>
                <FormItem {...formItemLayout} label="联系人" colon={false}>
                  {getFieldDecorator("linkman", {
                    initialValue: detailId === 0 ? null : detaildata.linkman,
                    rules: [
                      // { required: true, message: "请输入设备名称" },
                    ]
                  })(
                    <Input placeholder="请输入联系人" />
                  )}
                </FormItem>
              </Col>
              <Col span={12}>
                <FormItem {...formItemLayout} label="联系电话" colon={false}>
                  {getFieldDecorator("phone", {
                    initialValue: detailId === 0 ? null : detaildata.phone,
                    rules: [
                      // { required: true, message: "请输入设备名称" },
                    ]
                  })(
                    <Input placeholder="请输入联系电话" />
                  )}
                </FormItem>
              </Col>
              <Col span={12}>
                <FormItem {...formItemLayout} label="邮箱" colon={false}>
                  {getFieldDecorator("email", {
                    initialValue: detailId === 0 ? null : detaildata.email,
                    rules: [
                      // { required: true, message: "请输入设备名称" },
                    ]
                  })(
                    <Input placeholder="请输入传真" />
                  )}
                </FormItem>
              </Col>
              <Col span={12}>
                <FormItem {...formItemLayout} label="传真" colon={false}>
                  {getFieldDecorator("fax", {
                    initialValue: detailId === 0 ? null : detaildata.fax,
                    rules: [
                      // { required: true, message: "请输入设备名称" },
                    ]
                  })(
                    <Input placeholder="请输入传真" />
                  )}
                </FormItem>
              </Col>
              <Col span={24}>
                <FormItem {...formItemLayoutOne} label="备注" colon={false}>
                  {getFieldDecorator("remarks", {
                    initialValue: detailId === 0 ? null : detaildata.remarks,
                    rules: [{ max: 500, message: "不超过500个字" }]
                  })(
                    <TextArea
                      placeholder="请输入备注内容"
                      autosize={{ minRows: 3, maxRows: 6 }}
                    />
                  )}
                </FormItem>
              </Col>




            </Row>
          </Form>

        </Modal>

      </div>
    );
  }
}
